<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        .sanjiao{
            width: 0;
            height: 0;
            overflow: hidden;
            border-width:10px ;
            border-color:red transparent transparent transparent ;
            border-style:solid ;
        }
    </style>
</head>
<body  >
    <div class="sanjiao">
        <!-- 初始时:<ul>元素中仅显示5个<li>元素,其中包含还包括最后一个<li>元素,<a>元素中的显示"更多"字符.

        当点击"更多"链接时,自身内容变为"简化",同时,<ul>元素中显示全部的<li>元素.

            当点击"简化"链接时,自身内容变为"更多",同时,<ul>元素中仅显示包含最后一个<li>元素在内的5个元素.-->
    </div>
        <ul>
            <li style="display:none">1</li>
            <li style="display:none">2</li>
            <li>3</li>
            <li>4</li>
            <li>5</li>
            <li>6</li>
            <li>7</li>
        </ul>
    <a href="#" id="mya">更多</a>
    <input type="text" placeholder="123"/>
    <script src="jquery.js"></script>
    <script>
       /* var mya = $("#mya");
        console.log(mya);
        mya.click(function(){
            var html = $(this).html();
            if(html == '更多'){
                $(this).html('简化');
                $("li:hidden").show();
            }else{
                $(this).html('更多');
                $("li:eq(4)~li").hide();
            }
        });*/
        $(function () {
            $("#btntest").bind("hover", function () {
                $("div").toggle();
            });
            $("input").trigger("select");
        });
    </script>
</body>
</html>